﻿<%@ Page Title="" Language="C#" MasterPageFile="~/MasertTemplates.Master" AutoEventWireup="true"
    CodeBehind="MediaRoomImg.aspx.cs" Inherits="WebApplication.MediaRoomImg" %>

<%@ Register TagPrefix="uc1" TagName="usermeg" Src="~/UserControl/UserMessageControl.ascx" %>
<%@ Register TagPrefix="uc1" TagName="maintab" Src="~/UserControl/MainTabControl.ascx" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <script type="text/javascript" src="Media/Js/jquery.lightbox-0.5.js"></script>
    <link href="Media/Css/jquery.lightbox-0.5.css" rel="Stylesheet" />
    <link href="media/js/jquery.uploadify-v2.1.4/uploadify.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="media/js/jquery.uploadify-v2.1.4/swfobject.js"></script>
    <script type="text/javascript" src="media/js/jquery.uploadify-v2.1.4/jquery.uploadify.v2.1.4.min.js"></script>
    <script type="text/javascript" src="media/js/jquery-ui-1.8.10.custom.min.js"></script>
    <script type="text/javascript">
        var mediaroomcate = "";
        $(document).ready(function () {
            $('.ImgList .p2 a').lightBox();
            $('.ImgList .showbig').each(function () {
                var self = $(this);
                self.click(function () {
                    self.parents("li").find(".p2 img").click();
                });
            });

            mediaroomcate = $('#ContentPlaceHolder2_ddlMediaRoomCategory').val();

            $("#ContentPlaceHolder2_ddlMediaRoomCategory").change(function () {
                jQuery('option:selected', this).each(function () {
                    mediaroomcate = $(this).val();
                });
            });

            ///图片上传初始化 开始
            $("#uploadify").uploadify({
                'uploader': 'media/js/jquery.uploadify-v2.1.4/uploadify.swf',
                'script': 'ServerAshxFile/JqueryUploadHandler.ashx',
                'scriptData': { 'mediaType': 'image', 'custuid': '<%=CustUID %>', 'type': mediaroomcate },
                'method': 'GET',
                'cancelImg': 'media/js/jquery.uploadify-v2.1.4/cancel.png',
                'folder': 'media/upload/logo',
                'queueID': 'fileQueue',
                'auto': false,
                'multi': false,
                'displayData': 'speed',
                'fileExt': '*.jpg;*.gif;*.png;*.bmp',
                'fileDesc': 'Image Files',
                'sizeLimit': 2512000,
                'onInit': function () { },
                'onSelect': function (e, queueId, fileObj) {
                    $('#id_message').html("您选的文件:" + fileObj.name + "\r\n" + "文件大小:" + fileObj.size + "bytes \r\n");
                },
                'onAllComplete': function (event, data) {
                    var add_update = $('#hd_add_update').val();
                    if (add_update == 'add') {//add
                        $('#id_message').html('上传成功！');
                        $.get("ServerAshxFile/MediaRoomImg.ashx", { 'type': '2' }, function (data) {
                            createOneMediaRoom(mediaroomcate, data);

                            //--预览窗口重新初始化 开始
                            $('.ImgList .p2 a').lightBox();
                            $('.ImgList .showbig').each(function () {
                                var self = $(this);
                                self.click(function () {
                                    self.parents("li").find(".p2 img").click();
                                });
                            });
                            //--预览窗口重新初始化 结束
                                                  
                        });
                    }
                    else {//update
                        $.get("ServerAshxFile/MediaRoomImg.ashx", { 'type': '3', 'mediaroomUID': add_update.split('&')[1] }, function (data) {
                            $('#mediaroom_' + add_update.split('&')[1] + ' .p2').html(data);
                        });
                        $('#mediaroom_' + add_update.split('&')[1]).effect("pulsate", { times: 3 }, 400);
                    }

                    $('#wrapToggle').css('display', 'none').find('#tr_mediaroom_cate').css('display', 'none');
                }
            });
            ///图片上传初始化 结束

        });

        function createOneMediaRoom(category, data) {
            switch (category) {
                case "CustomerLogo":
                    $("#ImgList_Customerlogo").prepend(data.split('&')[1]);
                    $('#mediaroom_' + data.split('&')[0]).effect("pulsate", { times: 3 }, 400);
                    break;
                case "ContactPersonPhoto":
                    $("#ImgList_ContactPersonPhoto").prepend(data.split('&')[1]);
                    $('#mediaroom_' + data.split('&')[0]).effect("pulsate", { times: 3 }, 400);
                    break;
                case "BranchImg":
                    $("#ImgList_BranchImage").prepend(data.split('&')[1]);
                    $('#mediaroom_' + data.split('&')[0]).effect("pulsate", { times: 3 }, 400);
                    break;
                case "BrandLogo":
                    $("#ImgList_BrandLogo").prepend(data.split('&')[1]);
                    $('#mediaroom_' + data.split('&')[0]).effect("pulsate", { times: 3 }, 400);
                    break;
                case "ProductImg":
                    $("#ImgList_ProductImage").prepend(data.split('&')[1]);
                    $('#mediaroom_' + data.split('&')[0]).effect("pulsate", { times: 3 }, 400);
                    break;
                default:
                    break;
            }
        }

        function delMediaRoom(mediaroomUID) {
            ToggleDocument('ConfirmBox');
            $("#id_confirm_message").html("确定删除吗？");
            $("#id_confire_event").attr("href", "javascript:delMediaRoom_real(" + mediaroomUID + ")");            
        }


        function delMediaRoom_real(mediaroomUID) {
            var CustomerUID = '<%=CustUID %>';
            //if (confirm('确定删除吗？') == false) {
                //return;
           // }
            $.ajax({
                url: "ServerAshxFile/MediaRoomImg.ashx?type=1&mediaroomUID=" + mediaroomUID + "&Cuid=" + CustomerUID,
                //global: false,
                type: "POST",
                //data: { 'type': 1, 'mediaroomUID': mediaroomUID },
                //async: false,
                success: function (data) {
                    if (data == '1') {
                        $('#mediaroom_' + mediaroomUID).hide("explode", { pieces: 18 }, 800);
                        $("#mediaroom_" + mediaroomUID).remove();
                    }
                    else if (data == '2') {
                        //alert("别的地方使用到该图片，暂时不能删除！");
                    }
                    else {
                        //alert("该删除失败！");
                    }
                }
            });
            ToggleDocument('ConfirmBox');
        }

        function addMediaRoom() {
            if ($('#hd_add_update').val() != 'add') {
                $('#wrapToggle').css('display', 'block').find('#tr_mediaroom_cate').css('display', 'block');
            }
            else {
                ToggleDocument('wrapToggle');
                $('#wrapToggle').find('#tr_mediaroom_cate').css('display', 'block');
            }
            $('#hd_add_update').val('add');
            $('#id_message').html('');
        }

        function updateMediaRoom(mediaroomUID) {
            $('#wrapToggle').css('display', 'block').find('#tr_mediaroom_cate').css('display', 'none');
            $('#hd_add_update').val('update&' + mediaroomUID);
            $('#id_message').html("修改指定图片.");        
        }

        function SaveMediaRoom() {
            var upload = $("#uploadify");
            var add_update = $('#hd_add_update').val();

            if (add_update == 'add') {
                upload.uploadifySettings('scriptData', { 'custuid': '<%=CustUID %>', 'add_update': 'add', 'type': mediaroomcate });
            }
            else {
                upload.uploadifySettings('scriptData', { 'custuid': '<%=CustUID %>', 'add_update': 'update', 'mediaroomUID': add_update.split('&')[1] });
            }
            upload.uploadifyUpload();
            $('#id_message').html('');
        }
        //
        //var productType=$('#ContentPlaceHolder2_ddlMediaRoomCategory option:selected').text();
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <input type="hidden" value="t23" id="pageName" />
    
    <div class="content-title">
        <h1>
            Customer - Media Room</h1>
    </div>
    <div class="con-nav">
        <a href="Basicinformation.aspx" class="btn"><span class="ui-icon ui-icon-newwin"></span>
            Add New Customer</a>
    </div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
    <uc1:usermeg ID="usermeg" runat="server"></uc1:usermeg>
    <div class="partWrap">
        <uc1:maintab ID="maintab" runat="server" />
        <div class="clear20">
        </div>
        <p class="upinput">
            <span>Image</span> | <%--<a href="MediaRoomVideo.aspx">Video</a>--%>
            <asp:HyperLink ID="hyVideo" runat="server">Video</asp:HyperLink>
            </p>
        <div class="clear10">
        </div>
        <ul class="uibtn">
            <li onclick="addMediaRoom();"><span>Add Image</span></li>
        </ul>
        <div class="clear10">
        </div>
        <div id="wrapToggle" class="wrapToggle">
            <table border="0" cellspacing="0" cellpadding="0">
                <tr id="tr_mediaroom_cate">
                    <td colspan="2">
                        <asp:DropDownList ID="ddlMediaRoomCategory" runat="server" CssClass="select200">
                            <asp:ListItem Value="CustomerLogo">Logo / Trademark</asp:ListItem>
                            <asp:ListItem Value="ContactPersonPhoto">Contact Person Photo</asp:ListItem>
                            <asp:ListItem Value="BranchImg">Branch Image</asp:ListItem>
                            <asp:ListItem Value="BrandLogo">Brand Logo</asp:ListItem>
                            <asp:ListItem Value="ProductImg">Product Image</asp:ListItem>
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>
                    <td id="object_container" colspan="2">
                        <div id="fileQueue">
                        </div>
                        <span id="id_message" style="background-color: #ffc; color: Red;"></span>
                        <br />
                        <input type="file" name="uploadify" id="uploadify" />
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                    </td>
                </tr>
            </table>
            <div class="clear10">
            </div>
            <table border="0" cellspacing="0" cellpadding="0" class="btnwrap">
                <tr>
                    <td class="btnwrapl">
                        <ul class="uibtn">
                            <li><a href='javascript:SaveMediaRoom();'>Save</a><input id="hd_add_update" type="hidden"
                                value="add" /></li>
                        </ul>
                    </td>
                    <td class="btnwrapr">
                        <ul class="uibtn">
                            <li><a href='javascript:addMediaRoom();'>Quit</a></li>
                        </ul>
                    </td>
                    <td>
                    </td>
                </tr>
            </table>
        </div>
        <div class="clear15">
        </div>
        <%-- <p>
            20 images</p>--%>
        <div class="ImgWrap">

         


            <h4 class="title20">
                Logo / Trademark</h4>
            <ul class="ImgList" id="ImgList_Customerlogo">
                <%--<li>
                    <p class="p2">
                        <a href="photos/image2.jpg" title="Product name <br/> Model No.">
                            <img src="Media/Css/images/155_151.jpg"  alt=""/></a></p>
                    <p class="p1">
                        file img name</p>
                    <div class="p4">
                        <span class="showbig">View</span> | <span class="editBtnbig">Edit</span> | <span
                            class="closeBtnbig" onclick="closePannel('smallImgList')">Delete</span></div>
                </li>--%>
                <asp:Repeater ID="rp_CustomerLogo" runat="server">
                    <ItemTemplate>
                        <li id='<%# "mediaroom_"+Eval("MediaRoomUID") %>'>
                            <p class="p2">
                                <a href='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_600_400",".jpg") %>'>
                                    <img src='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_100_100",".jpg") %>' alt='' /></a></p>
                           <%-- <p class="p1">
                                <%# Eval("FileName")%></p>--%>
                            <div class="p4">
                                <span class="showbig">View</span> | <span class="editBtnbig"><a href='javascript:updateMediaRoom(<%#Eval("MediaRoomUID") %>);'>
                                    Edit</a></span> |
                                    <%#CreateDeleteHtml(Eval("MediaRoomUID")) %> 
                                    <%--| <span class="closeBtnbig"><a href='javascript:delMediaRoom(<%#Eval("MediaRoomUID") %>)'>
                                        Delete</a></span>--%>
                                        </div>
                        </li>
                    </ItemTemplate>
                </asp:Repeater>
            </ul>

            <%--弹出提示框 confirm 开始--%>
                        <div class="msgBoxPS">
                            <div class="SendEmailBox" id="ConfirmBox">
                                <table width="100%" border="0">
                                    <tr>
                                        <td>
                                            <h4>
                                                <img src="Media/Css/images/del-select.png" class="closeBtn" onclick="ToggleDocument('ConfirmBox');"
                                                    alt="" /><strong>确定信息.</strong></h4>
                                            <br />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <table id="Table1" width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                    <td>
                                                        <span id="id_confirm_message" style="color:red; font-weight:bold;"></span>
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                                <table border="0" cellspacing="0" cellpadding="0" class="btnwrap">
                                    <tr>
                                        <td class="btnwrapl">
                                            <ul class="uibtn">
                                                <li><a id="id_confire_event" href='javascript:ToggleDocument("ConfirmBox")'>Yes</a></li>
                                            </ul>
                                        </td>
                                        <td class="btnwrapr">
                                             <ul class="uibtn">
                                                <li><a href='javascript:ToggleDocument("ConfirmBox")'>No</a></li>
                                            </ul>
                                        </td>
                                        <td>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                        <%--弹出提示框 confirm 结束--%>

            <h4 class="title20">
                Contact Person Photo</h4>
            <ul class="ImgList" id="ImgList_ContactPersonPhoto">
                <asp:Repeater ID="rp_ContactPersonPhoto" runat="server">
                    <ItemTemplate>
                        <li id='<%# "mediaroom_"+Eval("MediaRoomUID") %>'>
                            <p class="p2">
                                <a href='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_600_400",".jpg") %>'>
                                    <img src='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_100_100",".jpg") %>' alt='' /></a></p>
                            <div class="p4">
                                <span class="showbig">View</span> | <span class="editBtnbig"><a href='javascript:updateMediaRoom(<%#Eval("MediaRoomUID") %>);'>
                                    Edit</a></span> |
                                <%#CreateDeleteHtml(Eval("MediaRoomUID")) %>
                            </div>
                        </li>
                    </ItemTemplate>
                </asp:Repeater>
            </ul>

            <h4 class="title20">
                Branch Image</h4>
            <ul class="ImgList" id="ImgList_BranchImage">
                <asp:Repeater ID="rp_BranchImage" runat="server">
                    <ItemTemplate>
                        <li id='<%# "mediaroom_"+Eval("MediaRoomUID") %>'>
                            <p class="p2">
                                <a href='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_600_400",".jpg") %>'>
                                    <img src='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_100_100",".jpg") %>' alt='' /></a></p>
                           <%-- <p class="p1">
                                <%# Eval("FileName")%></p>--%>
                            <div class="p4">
                                <span class="showbig">View</span> | <span class="editBtnbig"><a href='javascript:updateMediaRoom(<%#Eval("MediaRoomUID") %>);'>
                                    Edit</a></span> | <span class="closeBtnbig"><a href='javascript:delMediaRoom(<%#Eval("MediaRoomUID") %>)'>
                                        Delete</a></span></div>
                        </li>
                    </ItemTemplate>
                </asp:Repeater>
            </ul>
            <h4 class="title20">
                Brand Logo</h4>
            <ul class="ImgList" id="ImgList_BrandLogo">
                <asp:Repeater ID="rp_BrandLogo" runat="server">
                    <ItemTemplate>
                        <li id='<%# "mediaroom_"+Eval("MediaRoomUID") %>'>
                            <p class="p2">
                                <a href='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_600_400",".jpg") %>'>
                                    <img src='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_100_100",".jpg") %>' alt='' /></a></p>
                            <%--<p class="p1">
                                <%# Eval("FileName")%></p>--%>
                            <div class="p4">
                                <span class="showbig">View</span> | <span class="editBtnbig"><a href='javascript:updateMediaRoom(<%#Eval("MediaRoomUID") %>);'>
                                    Edit</a></span> | <span class="closeBtnbig"><a href='javascript:delMediaRoom(<%#Eval("MediaRoomUID") %>)'>
                                        Delete</a></span></div>
                        </li>
                    </ItemTemplate>
                </asp:Repeater>
            </ul>
            <h4 class="title20">
                Product Image</h4>
            <ul class="ImgList" id="ImgList_ProductImage">
                <asp:Repeater ID="rp_ProductImage" runat="server">
                    <ItemTemplate>
                        <li id='<%# "mediaroom_"+Eval("MediaRoomUID") %>'>
                            <p class="p2">
                                <a href='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_600_400",".jpg") %>'>
                                    <img src='<%#JoinPath(Eval("FilePath"),Eval("FileName"),"_100_100",".jpg") %>' alt='' /></a></p>
                            <%--<p class="p1">
                                <%# Eval("FileName")%></p>--%>
                            <div class="p4">
                                <span class="showbig">View</span> | <span class="editBtnbig"><a href='javascript:updateMediaRoom(<%#Eval("MediaRoomUID") %>);'>
                                    Edit</a></span> | <span class="closeBtnbig"><a href='javascript:delMediaRoom(<%#Eval("MediaRoomUID") %>)'>
                                        Delete</a></span></div>
                        </li>
                    </ItemTemplate>
                </asp:Repeater>
            </ul>
        </div>
    </div>
</asp:Content>
